<%@page contentType="text/html" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
    "http://www.w3.org/TR/html4/loose.dtd">
<%@taglib  uri="/struts-tags" prefix="s" %>

<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <title>Company Users Roles &amp; Store Priveliges</title>

        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <meta name="apple-mobile-web-app-capable" content="yes" />
        <meta name="description" content="">
        <meta name="author" content="">

        <!-- ===================== Touch Icons ===================== -->
        <link rel="shortcut icon" href="styles/Controls/favicon.ico">
        <link rel="apple-touch-icon-precomposed" sizes="144x144" href="styles/Controls/apple-touch-icon-144-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="114x114" href="styles/Controls/apple-touch-icon-114-precomposed.png">
        <link rel="apple-touch-icon-precomposed" sizes="72x72" href="styles/Controls/apple-touch-icon-72-precomposed.png">
        <link rel="apple-touch-icon-precomposed" href="styles/Controls/apple-touch-icon-57-precomposed.png">

        <!-- ===================== CSS ===================== -->

        <link rel="stylesheet" href="styles/Controls/forms_elements_files/bootstrap.min.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/bootstrap-responsive.min.css">

        <!-- Site specific - CSS -->
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/prettify.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/jquery-ui-1.8.20.custom.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/chosen.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/dropkick.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/multi-select.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/jquery.ibutton.css">

        <!-- Site specific - CSS -->
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/Calendar/prettify.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/Calendar/jquery-ui-1.8.20.custom.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/Calendar/jquery.tagedit.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/Calendar/calendar_default.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/Calendar/calendar_dark.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/Calendar/jquery.miniColors.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/Calendar/colorpicker.css">

        <!-- Common - CSS -->
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/common.css">
        <link rel="stylesheet" href="styles/Controls/forms_elements_files/theme_light.css" class="style_set">

        <!--[if lt IE 9]>
          <script src="styles/Controls/forms_elements_files/html5.js"></script>
        <![endif]-->
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.10.0/themes/base/jquery-ui.css" />
        <script src="http://code.jquery.com/jquery-1.8.3.js"></script>
        <script src="http://code.jquery.com/ui/1.10.0/jquery-ui.js"></script>
        <script type="text/javascript">
            function addRow(tableID) {
                var table = document.getElementById(tableID);
                var rowCount = table.rows.length;
                var row = table.insertRow(rowCount);
                var counts = rowCount - 1;

                //======= 1 of 6=====================
                var cell1 = row.insertCell(0);
                var checker = document.createElement("input");
                checker.type = "checkbox";
                checker.name = "chbox[" + counts + "]";
                cell1.appendChild(checker);

                //==========2 of 6===================
                var cell2 = row.insertCell(1);
                var company = document.createElement("SELECT");
                company.type = "";
                company.name = "urasp.userRole[" + counts + "].companyRolesSid";
                cell2.appendChild(company);
            <s:iterator value="companyRoles" var="i">
                    var option = document.createElement('option');
                    option.value = "<s:property value="#i.companyRoleSid"/>";
                    option.appendChild(document.createTextNode("<s:property value="#i.roleName"/>"));
                    company.appendChild(option);
            </s:iterator>
                    //===================3 of 6 ====================
                    var cell3 = row.insertCell(2);
                    var from = document.createElement("input");
                    from.type = "text";
                    from.name = "urasp.userRole[" + counts + "].from";
                    from.id = counts + "from";

                    from.onclick = function(event) {

                        $("#" + from.id).datepicker({
                            showWeek: true,
                            firstDay: 1
                        });

                    };
                    cell3.appendChild(from);
                    //======================4 of 6 ===================
                    var cell4 = row.insertCell(3);
                    var to = document.createElement("input");
                    to.type = "text";
                    to.name = "urasp.userRole[" + counts + "].to";
                    to.id = counts + "to";

                    to.onclick = function(event) {

                        $("#" + to.id).datepicker({
                            showWeek: true,
                            firstDay: 1
                        });

                    };
                    cell4.appendChild(to);
//==================================5 of 6==================

                    var cell5 = row.insertCell(4);
                    var activeFlag = document.createElement("input");
                    activeFlag.type = "checkbox";
                    activeFlag.name = "urasp.userRole[" + counts + "].activeFlag";
                    activeFlag.id = "urasp.userRole[" + counts + "].activeFlag";
                    activeFlag.onchange = function(event) {
                        if (activeFlag.checked) {
                            activeFlag.value = "true";
                            alert(activeFlag.value);
                        }
                    };
                    cell5.appendChild(activeFlag);
//====================================6 of 6 =======================
                    var cell6 = row.insertCell(5);
                    var button = document.createElement("a");
                    button.title = "Delete";
                    button.innerHTML = button.title;
                    button.href = "#";

                    cell6.appendChild(button);

                }


                function addRow2(tableID) {
                    var table = document.getElementById(tableID);
                    var rowCount = table.rows.length;
                    var row = table.insertRow(rowCount);
                    var counts = rowCount - 1;

                    //======= 1 of 7=====================
                    var cell1 = row.insertCell(0);
                    var checker = document.createElement("input");
                    checker.type = "checkbox";
                    checker.name = "chbox[" + counts + "]";
                    cell1.appendChild(checker);

                    //==========2 of 7===================
                    var cell2 = row.insertCell(1);
                    var store = document.createElement("SELECT");
                    store.type = "";
                    store.name = "urasp.userStorePriv[" + counts + "].storeId";
                    cell2.appendChild(store);
            <s:iterator value="stores" var="i">
                    var option = document.createElement('option');
                    option.value = "<s:property value="#i.storeSid"/>";
                    option.appendChild(document.createTextNode("<s:property value="#i.storeName"/>"));
                    store.appendChild(option);
            </s:iterator>
                    //===================3 of 7 ====================
                    var cell3 = row.insertCell(2);
                    var add = document.createElement("input");
                    add.type = "checkbox";
                    add.name = "urasp.userStorePriv[" + counts + "].add";
                    add.id = "urasp.userStorePriv[" + counts + "].add";
                    add.onchange = function(event) {
                        if (add.checked) {
                            add.value = "true";

                        }
                    };
                    cell3.appendChild(add);
                    //======================4 of 7 ===================
                    var cell4 = row.insertCell(3);
                    var transfer = document.createElement("input");
                    transfer.type = "checkbox";
                    transfer.name = "urasp.userStorePriv[" + counts + "].transfer";
                    transfer.id = "urasp.userStorePriv[" + counts + "].transfer";
                    transfer.onchange = function(event) {
                        if (transfer.checked) {
                            transfer.value = "true";
                        }
                    };
                    cell4.appendChild(transfer);
//==================================5 of 7==================
                    var cell5 = row.insertCell(4);
                    var issue = document.createElement("input");
                    issue.type = "checkbox";
                    issue.name = "urasp.userStorePriv[" + counts + "].issue";
                    issue.id = "urasp.userStorePriv[" + counts + "].issue";
                    issue.onchange = function(event) {
                        if (issue.checked) {
                            issue.value = "true";
                        }
                    };
                    cell5.appendChild(issue);

//====================================6 of 7 =======================
                    var cell6 = row.insertCell(5);
                    var Default = document.createElement("input");
                    Default.type = "checkbox";
                    Default.name = "urasp.userStorePriv[" + counts + "].Default";
                    Default.id = "urasp.userStorePriv[" + counts + "].Default";
                    Default.onchange = function(event) {
                        if (Default.checked) {
                            Default.value = "true";
                        }
                    };
                    cell6.appendChild(Default);
                    //================================ 7 of 7================
                    var cell7 = row.insertCell(6);
                    var button = document.createElement("a");
                    button.title = "Delete";
                    button.innerHTML = button.title;
                    button.href = "#";

                    cell7.appendChild(button);
                }
        </script>

    </head>
    <body>
        <div id="loader_cont">
            <img src="styles/Controls/forms_elements_files/page_loader.gif"/>
        </div>

        <div class="navbar navbar-fixed-top">
            <div class="navbar-inner">
                <div class="container">
                    <a class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
                        <span class="sweet-gray sweet-go-back-from-screen">&nbsp;</span>
                    </a>
                    <div class="nav-collapse">
                        <ul class="nav main_nav" role="navigation">
                            <li id="mail" class="styled dropdown mail">
                                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Mail<span class="info">2</span></a>
                                <ul class="dropdown-menu top_menu">
                                    <li><a class="mn_new_msg" href="mail.html"><span>New Message</span></a></li>
                                    <li><a class="mn_inbox" href="mail.html"><span>Inbox</span></a></li>
                                    <li><a class="mn_outbox" href="mail.html"><span>OutBox</span></a></li>
                                    <li><a class="mn_spam" href="mail.html"><span>Spam</span></a></li>
                                    <li><a class="mn_trash" href="mail.html"><span>Trash</span></a></li>
                                </ul>
                            </li>
                            <li id="chat" class="styled chat">
                                <a data-toggle="modal" href="#chat_modal">Chat<span class="info">5</span></a>
                            </li>
                            <li id="notification" class="styled dropdown notification">
                                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Notification<span class="info">4</span></a>
                                <ul class="dropdown-menu">
                                    <li>
                                        <a href="#">
                                            Lorem ipsum dolor sit amet, consectetur adipiscing elit...
                                            <span>07/19/2012</span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            Vivamus ut enim vitae nibh aliquet pre-tium lobortis sit amet tortor...
                                            <span>07/19/2012</span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            Ut id dui arcu, non tempus nunc...
                                            <span>07/19/2012</span>
                                        </a>
                                    </li>
                                    <li>
                                        <a href="#">
                                            Morbi faucibus suscipit nibh, ut pellen-tesque lectus pellentesque non....
                                            <span>07/19/2012</span>
                                        </a>
                                    </li>
                                    <li class="show_all"><a href="#">Show all notifications</a></li>
                                </ul>
                            </li>
                        </ul>
                        <ul class="main_nav nav pull-right">
                            <li id="search" class="search">
                                <a href="#">Search</a>
                                <div class="search_cont">
                                    <form class="navbar-search form-search">
                                        <input type="text" class="input-medium search-query" placeholder="Search">
                                        <button type="submit">Search</button>
                                    </form>
                                </div>
                            </li>
                            <li id="settings" class="styled dropdown settings">
                                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Settings</a>
                                <ul class="dropdown-menu top_menu">
                                    <li class="show_all">Settings</li>
                                    <li><a class="mn_site" href="#"><span>Site</span></a></li>
                                    <li><a class="mn_admin" href="#"><span>Admin</span></a></li>
                                    <li><a class="mn_mail" href="#"><span>Mail</span></a></li>
                                    <li><a class="mn_user" href="#"><span>User</span></a></li>
                                </ul>
                            </li>
                            <li id="profile" class="styled dropdown profile">
                                <a class="dropdown-toggle" data-toggle="dropdown" href="#">Profile</a>
                                <ul class="dropdown-menu top_menu">
                                    <jsp:include page="parts/profilecombo.jsp"/>
                                </ul>
                            </li>
                        </ul>
                    </div>
                    <h1 class="brand"><a href="index.html">PHOENIX</a></h1>
                </div>
            </div>
        </div>

        <div class="container">
            <div class="main_content row-fluid">

                <div class="span3">

                    <div class="side_nav sidebar-nav" data-spy="affix" data-offset-top="150">
                        <h3 class="main_menu group">
                            <span class="title">Main Menu</span>
                            <a id="nav_list_btn" class="btn-collapse btn btn-inverse">
                                <span class="sweet-gray sweet-go-back-from-screen">&nbsp;</span>
                            </a>
                        </h3>
                        <jsp:include page="parts/dashboard.jsp"/>
                    </div><!--/.well -->
                </div><!--/span-->
                <div class="span9">
                    <div class="row-fluid">
                        <div class="span12">

                            <div class="span12 no_space">



                                <form method="post" action="addurole">
                                    <div class="widget">
                                        <header>
                                            <h3>Company Users Roles &amp; Store
                                                Priveliges</h3>
                                            <ul class="toggle_content">
                                                <li class="arrow">&nbsp; <a href="#">Toggle Content</a></li>
                                            </ul>
                                        </header>

                                        <table style="width:100%">
                                            <tr>
                                                <td style="width: 140px">User Name:</td>
                                                <td>
                                            <section class="welly uniform_styled form_align">
                                                <div class="row-fluid">
                                                    <s:select name="urasp.userId" theme="simple"  class="chzn-select" style="width:150px;" tabindex="2" list="users" listValue="userName" listKey="userSid"/>

                                                </div>
                                            </section>
                                            </td>
                                            <td colspan="2">

                                            <section class="welly uniform_styled form_align">
                                                <div class="row-fluid">
                                                    <s:checkbox theme="simple" name="urasp.activeRecord"/>
                                                    Active Record </div></section></td>

                                            </tr>
                                        </table>


                                        <ul class="nav nav-tabs tab_styled_dark">
                                            <li class="active"><a href="#home_2" data-toggle="tab">User Role</a></li>
                                            <li><a href="#portfolio_2" data-toggle="tab">User Store Privileges</a></li>
                                        </ul>
                                        <div class="tab-content tab_content_dark">
                                            <div id="home_2" class="tab-pane fade active in">
                                                <div class="widget table_basic_header">
                                                    <header>
                                                        <h3>User Role details</h3>
                                                        <ul class="toggle_content">
                                                            <li class="arrow"><a href="#">Toggle Content</a></li>
                                                        </ul>
                                                    </header>
                                                    <section class="welly uniform_styled">
                                                        <div class="row-fluid">
                                                            <input type="button" value="Add New Record" onclick="addRow('roleTable');"/>
                                                        </div>
                                                    </section>
                                                    <section>
                                                        <table id="roleTable"  class="table_basic chbox css">
                                                            <thead>
                                                                <tr>
                                                                    <td><input name="chbox" type="checkbox" style="text-align:left"></td>
                                                                    <td>Role Name</td>
                                                                    <td>From Date</td>
                                                                    <td>To Date</td>
                                                                    <td>Active</td>
                                                                    <td></td>
                                                                </tr>
                                                            </thead>
                                                            <tbody>

                                                            </tbody>
                                                        </table>
                                                    </section>
                                                </div>

                                            </div>
                                            <div id="portfolio_2" class="tab-pane fade">
                                                <div class="widget table_basic_header">
                                                    <header>
                                                        <h3>User Store Privileges detailes</h3>
                                                        <ul class="toggle_content">
                                                            <li class="arrow"><a href="#">Toggle Content</a></li>
                                                        </ul>
                                                    </header>
                                                    <section class="welly uniform_styled">
                                                        <div class="row-fluid">
                                                            <input type="button" value="Add New Record"  onclick="addRow2('check_1');"/>
                                                        </div>
                                                    </section>
                                                    <section>
                                                        <table id="check_1" class="table_basic chbox css">
                                                            <thead>
                                                                <tr>
                                                                    <td style="text-align:center"><input name="chbox" type="checkbox" value=""></td>
                                                                    <td>Store Name</td>
                                                                    <td style="text-align:center">Add</td>
                                                                    <td style="text-align:center">Transfer</td>
                                                                    <td style="text-align:center">Issue</td>
                                                                    <td style="text-align:center">Default</td>
                                                                    <td></td>
                                                                </tr>
                                                            </thead>
                                                            <tbody>


                                                            </tbody>
                                                        </table>
                                                    </section>
                                                </div>

                                            </div>
                                        </div>
                                        <section class="welly uniform_styled">
                                            <div class="row-fluid">
                                                <s:submit theme="simple" value="Save"/>
                                                <s:reset theme="simple" value="Reset"/>
                                            </div>
                                        </section>

                                    </div>
                                </form>

                            </div>

                        </div>
                    </div><!--/row-->

                </div><!--/span-->
            </div><!--/row-->

            <footer>
                <p>&copy; Infolink URS 2013</p>
            </footer>

        </div><!--/.fluid-container-->

        <!-- ===================== CHAT - Modal ===================== -->
        <div id="chat_modal" class="chat_modal modal fade hide">
            <div class="modal-header">
                <ul>
                    <li class="toggle_users"><a href="#">Show Users</a></li>
                    <li class="status">
                        <a class="online" href="#"><span>Status</span></a>
                        <ul>
                            <li><a class="online" href="#" title="Online"><span>Online</span></a></li>
                            <li><a class="away" href="#" title="Away"><span>Away</span></a></li>
                            <li><a class="busy" href="#" title="Busy"><span>Busy</span></a></li>
                            <li><a class="invisiblee" href="#" title="Invisible"><span>Invisible</span></a></li>
                            <li><a class="offline" href="#" title="Offline"><span>Offline</span></a></li>
                        </ul>
                    </li>
                    <li class="chat_name">John Doe</li>
                </ul>
                <button type="button" class="close" data-dismiss="modal">x</button>
            </div>
            <div class="modal-body">
                <div class="msg_cont left">
                    <img src="styles/Controls/forms_elements_files/user_1.jpg" width="50" height="50" alt="User">
                    <ul>
                        <li>
                            <h3>John Doe:</h3>
                            <span>16 minutes ago</span>
                        </li>
                        <li>Aliquam iaculis volutpat ipsum ullamcorper tempus. In in dui tortor. Mauris sed volutpat
                            metus. Duis ut sapien sapien, id pellentesque orci. Nullam nisl metus, sodales ut laoreet
                            eget, pretium porttitor quam. Sed varius vulputate lacinia. </li>
                    </ul>
                </div>
                <div class="msg_cont right">
                    <img src="styles/Controls/forms_elements_files/user_2.jpg" width="50" height="50" alt="User">
                    <ul>
                        <li>
                            <h3>Jessie Doe:</h3>
                            <span>16 minutes ago</span>
                        </li>
                        <li>Aliquam iaculis volutpat ipsum ullamcorper tempus. In in dui tortor. Mauris sed volutpat
                            metus. Duis ut sapien sapien, id pellentesque orci. Nullam nisl metus, sodales ut laoreet
                            eget, pretium porttitor quam. Sed varius vulputate lacinia. </li>
                    </ul>
                </div>
                <div class="msg_cont left">
                    <img src="styles/Controls/forms_elements_files/user_1.jpg" width="50" height="50" alt="User">
                    <ul>
                        <li>
                            <h3>John Doe:</h3>
                            <span>16 minutes ago</span>
                        </li>
                        <li>Aliquam iaculis volutpat ipsum ullamcorper tempus. In in dui tortor. Mauris sed volutpat
                            metus. Duis ut sapien sapien, id pellentesque orci. Nullam nisl metus, sodales ut laoreet
                            eget, pretium porttitor quam. Sed varius vulputate lacinia. </li>
                    </ul>
                </div>
            </div>
            <div class="modal-footer">
                <textarea></textarea>
                <a href="#" class="btn btn-inverse">Send</a>
            </div>
        </div>

        <!-- ===================== JS ===================== -->
        <script src="styles/Controls/forms_elements_files/jquery-1.7.2.min.js"></script>
        <script src="styles/Controls/forms_elements_files/bootstrap.min.js"></script>
        <script src="styles/Controls/forms_elements_files/ios-orientationchange-fix.js"></script>
        <script src="styles/Controls/forms_elements_files/jquery-ui-1.8.20.custom.min.js"></script>
        <script src="styles/Controls/forms_elements_files/common.js"></script>

        <!-- Site specific - JS -->
        <script src="styles/Controls/forms_elements_files/prettify.js"></script>
        <script src="styles/Controls/forms_elements_files/jquery.maskedinput-1.3.min.js"></script>
        <script src="styles/Controls/forms_elements_files/chosen.jquery.min.js"></script>
        <script src="styles/Controls/forms_elements_files/scrollability.min.js"></script>
        <script src="styles/Controls/forms_elements_files/jquery.dropkick-1.0.0.js"></script>
        <script src="styles/Controls/forms_elements_files/jquery.multi-select.js"></script>
        <script src="styles/Controls/forms_elements_files/jquery.quicksearch.js"></script>
        <script src="styles/Controls/forms_elements_files/jquery.autogrowtextarea.js"></script>
        <script src="styles/Controls/forms_elements_files/jquery.textareaCounter.plugin.js"></script>
        <script src="styles/Controls/forms_elements_files/ui.spinner.min.js"></script>
        <script src="styles/Controls/forms_elements_files/jquery.ibutton.min.js"></script>
        <script src="styles/Controls/forms_elements_files/jquery.metadata.js"></script>

        <script src="styles/Controls/forms_elements_files/script.js"></script>
        <script src="styles/Controls/forms_elements_files/forms_elements.js"></script>





        <!-- Site specific -->
        <script src="styles/Controls/forms_elements_files/Calendar/prettify.js"></script>
        <script src="styles/Controls/forms_elements_files/Calendar/jquery.autoGrowInput.js"></script>
        <script src="styles/Controls/forms_elements_files/Calendar/jquery.tagedit.js"></script>
        <script src="styles/Controls/forms_elements_files/Calendar/slidernav-min.js"></script>
        <script src="styles/Controls/forms_elements_files/Calendar/glDatePicker.min.js"></script>
        <script src="styles/Controls/forms_elements_files/Calendar/jquery-ui-timepicker-addon.js"></script>
        <script src="styles/Controls/forms_elements_files/Calendar/jquery-ui-sliderAccess.js"></script>
        <script src="styles/Controls/forms_elements_files/Calendar/jquery.miniColors.min.js"></script>
        <script src="styles/Controls/forms_elements_files/Calendar/colorpicker.js"></script>
        <script src="styles/Controls/forms_elements_files/Calendar/jquery.knob.js"></script>

        <script src="styles/Controls/forms_elements_files/Calendar/script.js"></script>
        <script src="styles/Controls/forms_elements_files/Calendar/sparks.js"></script>
        <script src="styles/Controls/forms_elements_files/Calendar/widgets.js"></script>


        <script type="text/javascript">

                var _gaq = _gaq || [];
                _gaq.push(['_setAccount', 'UA-31818910-2']);
                _gaq.push(['_setDomainName', 'loxdesign.net']);
                _gaq.push(['_trackPageview']);

                (function() {
                    var ga = document.createElement('script');
                    ga.type = 'text/javascript';
                    ga.async = true;
                    ga.src = ('https:' == document.location.protocol ? 'https://ssl' : 'http://www') + '.google-analytics.com/ga.js';
                    var s = document.getElementsByTagName('script')[0];
                    s.parentNode.insertBefore(ga, s);
                })();

        </script>
    </body>
</html>
